<template>
    <!--建档资料维护模块 财务告知页面-->
    <div class="baseInfoPage">
        <div class="table_container mt20">
            <el-table
                :data="cusf06List"
                highlight-current-row
                header-cell-class-name="table-header-class"
                style="width:100%">
                <el-table-column
                    property="descitem"
                    label="对象"
                    align='center'>
                        <template slot-scope="scope">
                            <div v-if="scope.row.descitem=='01'">
                                被保人
                            </div>
                            <div v-if="scope.row.descitem=='02'">
                                投保人
                            </div>
                        </template>
                </el-table-column>
                <el-table-column
                    property="instprem01"
                    label="去年年薪"
                    align='center'>
                </el-table-column>
                <el-table-column
                    property="instprem02"
                    label="投资收入"
                    align='center'>
                </el-table-column>
                <el-table-column
                    property="instprem03"
                    label="总计"
                    align='center'>
                </el-table-column>
            </el-table>
        </div>

         <el-form :rules="rules" label-width="160px" class="search_container">
            <el-row class="mt20 common-box">
                    <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                             <label class="labelName">被保险人总收入(万元/年收入)</label>
                        </el-col>
                         <el-col :span="14">
                            <el-input-number  @change="handleChange($event,'if')" :disabled="flag =='N'" v-model="euaa.inAnne" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                         </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                             <label class="labelName">投保险人总收入(万元/年收入)</label>
                        </el-col>
                         <el-col :span="14">
                            <el-input-number @change="handleChange($event,'ow')" :disabled="flag =='N'"  v-model="euaa.ownerAnne" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                         </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                             <label class="labelName">投保人家庭收入(万元/年收入)</label>
                        </el-col>
                         <el-col :span="14">
                             <el-input-number @change="handleChange($event,'on')"  :disabled="flag =='N'"  v-model="fnncllnfrm.ownerTrnamt" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                         </el-col>
                    </el-col>
                </el-row>
                <el-row class="common-box">
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                             <label class="labelName">被保人 有其他负债与贷款</label>
                        </el-col>
                         <el-col :span="14">
                            <el-select  :disabled="flag =='N'" v-model="fnncllnfrm.inLblts"  placeholder="请选择" >
                                <el-option
                                    v-for="item in lblts"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                         </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                            <label class="labelName">原因</label>
                        </el-col>
                        <el-col :span="14">
                            <el-input :disabled="flag =='N'"  v-model="fnncllnfrm.inLbltsRsn"  placeholder="原因"></el-input>
                        </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                            <label class="labelName">金额（万元）</label>
                        </el-col>
                         <el-col :span="14">
                            <el-input-number @change="handleChange($event,'inLbltsAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.inLbltsAmt" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                         </el-col>
                    </el-col>
                </el-row>
                <el-row class="common-box">
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                             <label class="labelName">投保人 有其他负债与贷款</label>
                        </el-col>
                         <el-col :span="14">
                            <el-select :disabled="flag =='N'"  v-model="fnncllnfrm.ownerLblts"  placeholder="请选择" >
                                <el-option
                                    v-for="item in lblts"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                         </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                            <label class="labelName">原因</label>
                        </el-col>
                        <el-col :span="14">
                            <el-input :disabled="flag =='N'"  v-model="fnncllnfrm.ownerLbltsRsn"  placeholder="原因"></el-input>
                        </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                            <label class="labelName">金额（万元）</label>
                        </el-col>
                         <el-col :span="14">
                            <el-input-number @change="handleChange($event,'ownerLbltsAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.ownerLbltsAmt" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                         </el-col>
                    </el-col>
                </el-row>
                <el-row class="common-box">
                     <el-col :span="8" >
                        <el-col :span="10" class="common-lab">
                             <label class="labelName">被保人 房贷/车贷未偿还金额（万）</label>
                        </el-col>
                         <el-col :span="14">
                            <el-input-number  @change="handleChange($event,'inOtstndAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.inOtstndAmt" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                         </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                            <label class="labelName">投保人 房贷/车贷未偿还金额（万）</label>
                        </el-col>
                        <el-col :span="14">
                            <el-input-number  @change="handleChange($event,'ownerOtstndAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.ownerOtstndAmt" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                        </el-col>
                    </el-col>
                     <el-col :span="8">
                        <el-col :span="10" class="common-lab">
                            <label class="labelName">被保人 其他公司的寿险保额（万）</label>
                        </el-col>
                         <el-col :span="14">
                            <el-input-number  @change="handleChange($event,'inOtherLifeAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.inOtherLifeAmt" :min="0"
                                :precision="2" :step="0.1" controls-position="right" />
                         </el-col>
                    </el-col>
                </el-row>
           <!--   第二被保人需求   start     -->
           <el-row class="common-box" v-if="isShowSecondFianceInfo">
             <el-col :span="8">
               <el-col :span="10" class="common-lab">
                 <label class="labelName">第二被保人 有其他负债与贷款</label>
               </el-col>
               <el-col :span="14">
                 <el-select  :disabled="flag =='N'" v-model="fnncllnfrm.secondInLblts"  placeholder="请选择" >
                   <el-option
                       v-for="item in lblts"
                       :key="item.value"
                       :label="item.label"
                       :value="item.value">
                   </el-option>
                 </el-select>
               </el-col>
             </el-col>
             <el-col :span="8">
               <el-col :span="10" class="common-lab">
                 <label class="labelName">原因</label>
               </el-col>
               <el-col :span="14">
                 <el-input :disabled="flag =='N'"  v-model="fnncllnfrm.secondInLbltsRsn"  placeholder="原因"></el-input>
               </el-col>
             </el-col>
             <el-col :span="8">
               <el-col :span="10" class="common-lab">
                 <label class="labelName">金额（万元）</label>
               </el-col>
               <el-col :span="14">
                 <el-input-number @change="handleChange($event,'secondInLbltsAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.secondInLbltsAmt" :min="0"
                                  :precision="2" :step="0.1" controls-position="right" />
               </el-col>
             </el-col>
           </el-row>

           <el-row class="common-box" v-if="isShowSecondFianceInfo">
             <el-col :span="8" >
               <el-col :span="10" class="common-lab">
                 <label class="labelName">第二被保人 房贷/车贷未偿还金额（万）</label>
               </el-col>
               <el-col :span="14">
                 <el-input-number  @change="handleChange($event,'secondInOtstndAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.secondInOtstndAmt" :min="0"
                                   :precision="2" :step="0.1" controls-position="right" />
               </el-col>
             </el-col>
             <el-col :span="8">
               <el-col :span="10" class="common-lab">
                 <label class="labelName">第二被保人 其他公司的寿险保额（万）</label>
               </el-col>
               <el-col :span="14">
                 <el-input-number  @change="handleChange($event,'secondInOtherLifeAmt')" :disabled="flag =='N'"  v-model="fnncllnfrm.secondInOtherLifeAmt" :min="0"
                                   :precision="2" :step="0.1" controls-position="right" />
               </el-col>
             </el-col>
           </el-row>
           <!--   第二被保人需求   end     -->
        </el-form>
    </div>
</template>
<script>
    import constant from '@/utils/constant';
    export default {
        data(){
            return {
                value:'',
                cusf06List: [],//  财务告知对象
                fnncllnfrm: {},// 财务告知表单
                euaa: {},
                // 被保人有其它负债与贷款选择项
                lblts:[
                    {
                        value:'',
                        label:'',
                    },
                    {
                        value:'1',
                        label:'是',
                    },{
                        value:'0',
                        label:'否',
                    },{
                        value:'2',
                        label:'漏填',
                    }
                ],
                rules: {},
                insureDataForm: this.insureData,
                // 第二被保人需求 是否展示第二被保人财务信息
                isShowSecondFianceInfo: false,
            }
        },
        props:{
			flag:{
				type:String
			},
            insureData:{
                type: Object,
            }
        },
        mounted(){
            this.reloadInsureData(null);
        },
        methods: {
			handleChange(value,type){
				this.$nextTick(() => {
					if(value>=100000){
						this.$message({
						  message: "金额不能大于五位数，请重新输入",
						  type: "error",
						  showClose: true,
						  duration:15000
						});
						if(type =='if') {
							this.euaa.inAnne =0;
						} else if(type =='ow') {
							this.euaa.ownerAnne = 0;
						} else if(type =='on') {
							this.fnncllnfrm.ownerTrnamt = 0;
						} else if(type =='inLbltsAmt') {
							this.fnncllnfrm.inLbltsAmt = 0;
						} else if(type =='ownerLbltsAmt') {
							this.fnncllnfrm.ownerLbltsAmt = 0;
						} else if(type =='inOtstndAmt') {
							this.fnncllnfrm.inOtstndAmt = 0;
						} else if(type =='ownerOtstndAmt') {
							this.fnncllnfrm.ownerOtstndAmt = 0;
						}else if(type =='inOtherLifeAmt') {
							this.fnncllnfrm.inOtherLifeAmt = 0;
						} else if (type == 'secondInLbltsAmt') {
              this.fnncllnfrm.secondInLbltsAmt = 0;
            } else if (type == 'secondInOtstndAmt') {
              this.fnncllnfrm.secondInOtstndAmt = 0;
            } else if (type == 'secondInOtherLifeAmt') {
              this.fnncllnfrm.secondInOtherLifeAmt = 0;
            }
					}
				})
			},
            reloadInsureData(insureData){
                if(insureData != null){
                    this.insureDataForm = insureData;
                }
                this.cusf06List = this.insureDataForm.cusf06List;
                this.fnncllnfrm = this.insureDataForm.fnncllnfrm;
                this.euaa = this.insureDataForm.euaa;
                // 第二被保人需求 判断第二被保人财务信息展示与否
                this.getIsShowSecondFianceInfo(this.insureDataForm.euad3.clntnum);
            },
            getInsureData(){
                return this.insureDataForm;
            },
            getIsShowSecondFianceInfo(euad3Clntnum) {
              if (euad3Clntnum) {
                 this.isShowSecondFianceInfo = true;
              }
            }
        },
        watch:{
            /**insureDataForm:{
                handler(val, oldVal){
                   if(this.insureDataForm != undefined){
                        this.$emit('updataFinance', this.insureDataForm)
                    }
                },
                deep:true
            }**/
        }
    }
</script>
<style lang="less" scoped>
.baseInfoPage{
    .common-box{
        padding-bottom: 15px;
    }
    .common-lab{
        line-height:normal!important;
        text-align: right;
        .labelName{
            text-align: right;
        }
    }
}
</style>
